/**
 * @file detail.tsx
 * @description 待配送详情
 */
 import React,{ useState, } from 'react';
 import { Box, FlatList, Heading, Avatar, HStack, VStack, Text, Spacer, Center, Button,ScrollView,AlertDialog,} from 'native-base';
 import HeaderScreen from '../../components/header';
 import * as request from "../../request/common";
 import { useMount } from "ahooks";
 
 const DispatchingDetailsStatusScreen: React.FC<ComponentProp> = ({ navigation,route }) => {
   /******变量******/
   const routeParams: any = route?.params;
   const [packagesList,setPackagesList] = useState([]); // 未出库包装清单 

 
   /******生命周期******/
   useMount(() => {
    getDispatchingList();
 
   });
 
   /******方法******/
 
   /**
    * 生产单包装列表
    */
   const getDispatchingList = ()=>{
    request.getPackagesList(routeParams?.productionInfo?.factory_order_id).then((res: any) => {
      if (res?.code == 40020) {
        let list: any = [];
        const grouped: any = {};
        res?.data.forEach((item: any) => {
          if (!grouped[item.packages_name]) {
            grouped[item.packages_name] = [];
          }
          grouped[item.packages_name].push(item);
        });
        for (const key in grouped) {
          if (grouped.hasOwnProperty(key)) {
            let pkList = ""; // 未入库的包数
            grouped[key].forEach((element: any) => {
              pkList+= element?.package_index +", ";
            });
            pkList =pkList.replace(/,\s*$/, "");
            list.push({
              key:key,
              pkList:pkList,
            })
          }
        }
        setPackagesList(list);
      }
    });
   }

 
   return (
     <Box bg="gray.100" borderRadius="md" w="100%" h="100%">
       <HeaderScreen navigation={navigation}  title={routeParams?.orderInfo?.code_id}></HeaderScreen>
       <HStack direction="column" space={1} py="4" px="4"  borderBottomWidth="0.3"
             borderColor="muted.300"  >
        <Text>地址:<Text bold>{'  '}{routeParams?.orderInfo?.address_detail}</Text></Text>
        <Text>司机:<Text bold>{'  '}{routeParams?.orderInfo?.driver_name}{routeParams?.orderInfo?.driver_mobile? "，"+routeParams?.orderInfo?.driver_mobile: ''}</Text></Text>
       </HStack>
       <ScrollView mb="20">
        {packagesList?.map((item: any)=>{
          return(<Box
            key={item.key}
            borderWidth="0.3"
            borderColor="muted.300"
            rounded="xl"
            px="4"
            py="4"
            mx="4"
            my="4"
            >
             <HStack  w='100%'  justifyContent="space-between" >
              <VStack w='70%' textAlign="left" space="0.5" pl="0"  >
              <Text color="coolGray.600" bold >
                {item?.key}
                </Text>
                <Text color="coolGray.600" >
                  未上车:
                </Text>
                <Text color="error.500" >
                {item?.pkList}
                </Text>
              </VStack>
            </HStack>
      </Box>)
        })}
       </ScrollView>
      
       
     </Box>
   );
 };
 
 export default DispatchingDetailsStatusScreen;
 